<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-table
          ref="table"
          size="middle"
          :scroll="{x:true}"
          bordered
          rowKey="id"
          :columns="columns"
          :dataSource="dataSource"
          :pagination="ipagination"
          :loading="loading"
          class="j-table-force-nowrap">
          <template slot="timeSlot" slot-scope="text, record">
            <div v-if="record.effectBeginTime">开始时间：{{ record.effectBeginTime }}</div>
            <div v-if="record.effectEndTime">结束时间：{{ record.effectEndTime }}</div>
          </template>
          <span slot="action" slot-scope="text, record">
            <!-- 未开始状态可进行删除和编辑操作 -->
            <template v-if="record.effectStatus === '1'">
              <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
                <a>删除</a>
              </a-popconfirm>
              <a-divider type="vertical" />
              <!-- <a @click="handleEdit(record)">编辑</a>
              <a-divider type="vertical" /> -->
            </template>
            <a @click="handleDetail(record)">查看详情</a>
          </span>
        </a-table>
      </a-form-model>
    </j-form-container>

    <logistics-sales-price-modal ref="modalForm" @ok="modalFormOk"></logistics-sales-price-modal>
  </a-spin>
</template>

<script>
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import LogisticsSalesPriceModal from './LogisticsSalesPriceModal'
  export default {
    name: 'LogisticsHistoricalQuotationForm',
    mixins:[JeecgListMixin],
    components: {
      LogisticsSalesPriceModal
    },
    props: {
      //表单禁用
      disabled: {
        type: Boolean,
        default: false,
        required: false
      }
    },
    data () {
      return {
        model:{},
        confirmLoading: false,
        validatorRules: {
        },
        url: {
          add: "/logistics/sales/logisticsSalesPrice/add",
          edit: "/logistics/sales/logisticsSalesPrice/edit",
          queryById: "/logistics/sales/logisticsSalesPrice/queryById",
          queryLatestVersion: '/logistics/sales/logisticsSalesPrice/queryLatestVersion',
          list: "/logistics/sales/logisticsSalesPrice/queryVersionList",
          delete: "/logistics/sales/logisticsSalesPrice/delete",
          assignDepart: "/logistics/sales/logisticsSalesPrice/assignDepart"
        },
        // 表头
        columns: [
          {
            title: '#',
            dataIndex: '',
            key:'rowIndex',
            width:60,
            align:"center",
            customRender:function (t,r,index) {
              return parseInt(index)+1;
            }
          },
          {
            title:'生效时间',
            align:"center",
            dataIndex: 'effectBeginTime',
            scopedSlots: { customRender: 'timeSlot' }
          },
          {
            title:'状态',
            align:"center",
            dataIndex: 'effectStatus_dictText'
          },
          {
            title:'创建时间',
            align:"center",
            dataIndex: 'createTime'
          },
          {
            title: '操作',
            dataIndex: 'action',
            align:"center",
            width:147,
            scopedSlots: { customRender: 'action' }
          }
        ],
        disableMixinCreated: true
      }
    },
    created () {
      this.title__ = this.title_;
      this.formDisabled = this.disabled;
      //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model));
    },
    methods: {
      add () {
        this.edit(this.modelDefault);
      },
      edit (record) {
        this.model = Object.assign({}, record);
        this.visible = true;
        // 编辑、历史价格
        if(this.model.id){
          this.queryParam = {
            code: record.code
          };
          this.loadData();
        }
      },
    }
  }
</script>

<style scoped lang="less">
.ant-checkbox-wrapper{
  height: 40px;
  line-height: 40px;
}
/deep/.ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab-active{
  border-color: #1890FF;
  border-bottom: 1px solid #fff;
  background: rgba(24,144,255, 0.1);
}
/deep/.ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab{
  border-color: #1890FF;
  border-bottom: 1px solid #fff;
  color: #1890FF;
}
</style>